<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<div style="height: 450px;" id="userChar"></div>
<script>
	$(function() {
		var userChar = echarts.init(document.getElementById('userChar'));
			var userCharOption = {
				title : {
					text : '关注用户数统计',
					subtext : ''
				},
				tooltip : {
					trigger : 'axis'
				},
				legend : {
					data : ['总用户数', '每天新增用户数']
				},
				toolbox : {
					show : true,
					feature : {
						mark : {
							show : true
						},
						dataView : {
							show : true,
							readOnly : false
						},
						magicType : {
							show : true,
							type : ['line', 'bar']
						},
						restore : {
							show : true
						},
						saveAsImage : {
							show : true
						}
					}
				},
				calculable : true,
				xAxis : [{
					type : 'category',
					boundaryGap : false,
					data : ['2014.04.01', '2014.04.02', '2014.04.03', '2014.04.04', '2014.04.05', '2014.04.06', '2014.04.07']
				}],
				yAxis : [{
					type : 'value',
					splitArea : {
						show : true
					}
				}],
				series : [{
					name : '总用户数',
					type : 'line',
					itemStyle : {
						normal : {
							lineStyle : {
								shadowColor : 'rgba(0,0,0,0.4)',
								shadowBlur : 5,
								shadowOffsetX : 3,
								shadowOffsetY : 3
							}
						}
					},
					data : [100, 120, 150, 175, 210, 250, 260]
				}, {
					name : '每天新增用户数',
					type : 'line',
					itemStyle : {
						normal : {
							lineStyle : {
								shadowColor : 'rgba(0,0,0,0.4)',
								shadowBlur : 5,
								shadowOffsetX : 3,
								shadowOffsetY : 3
							}
						}
					},
					data : [10, 20, 30, 25, 35, 40, 10]
				}]
			};
			userChar.setOption(userCharOption);
	}); 
</script>
